@layer components {
  .product-item {
    @apply m-3;

    &.desktop {
      @apply w-56;

      &.active {
        @apply bg-primary ring-2 ring-primary;
      }
    }

    &.tablet {
      @apply max-w-2xl w-full flex justify-between items-center;
    }
  }
}
